<style>
    #VIEW-reset {
        height: 100%;
        background: #252834;
        padding-top: 1px;
        margin-top: -1px;
    }
    
    #VIEW-reset .layui-logo {
        user-select: none;
        overflow: hidden;
        position: static;
        font-size: 30px;
        color: #d6e0f6;
        width: 100%;
        padding: 0;
        line-height: 120px;
        height: 120px;
        color: #3491ff;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        transition: height .8s cubic-bezier(0.075, 0.82, 0.165, 1);
    }
    
    #VIEW-reset .layui-logo span {
        font-weight: normal;
        color: #fff;
        border-bottom: 1px solid #3491ff;
    }
    
    #VIEW-reset .layui-logo span b {
        color: #3491ff;
    }
    
    #VIEW-reset .reset-wrap {
        position: relative;
        top: 50%;
        margin-top: -290px;
        height: 540px;
    }
    
    #VIEW-reset .layui-form {
        overflow: hidden;
        background: #fff;
        padding: 40px;
        padding-bottom: 20px;
        border-radius: 0px;
        box-shadow: 0 0 30px #000;
        position: relative;
    }
    
    #VIEW-reset .layui-form-item {
        position: relative;
    }
    
    #VIEW-reset .verify-block {
        display: none;
    }
    
    #VIEW-reset .layui-input {
        text-indent: 26px;
    }
    
    #VIEW-reset .codeimg {
        margin-left: 10px;
        cursor: pointer;
    }
    
    #VIEW-reset .sendsms {
        position: absolute;
        top: 4px;
        right: 4px;
        width: 100px;
        border: none;
    }
    
    #VIEW-reset .sendsms.layui-btn-disabled {
        background: #f4f4f4;
        color: #bbb;
    }
    
    #VIEW-reset .houseimg {
        text-align: center;
    }
    
    #VIEW-reset .houseimg img {
        display: inline-block;
        margin-top: 5%;
    }
    
    #VIEW-reset .reset-type-tab {
        margin-bottom: 20px;
        overflow: hidden;
    }
    
    #VIEW-reset .reset-type-tab li {
        display: inline-block;
        padding-right: 20px;
        font-size: 16px;
        line-height: 30px;
        color: #bbb;
        cursor: pointer;
        transition: color .5s ease;
    }
    
    #VIEW-reset .reset-type-tab li.active {
        color: #333;
    }
    
    #VIEW-reset .reset-type-tab li .qrcode-icon {
        font-size: 24px;
    }
    
    #VIEW-reset .qrcode-block {
        text-align: center;
        display: none;
    }
    
    #VIEW-reset .qrcode-block .qrcode {
        border: 1px solid #eee;
        display: inline-block;
        padding: 15px;
        margin: 30px 0;
        width: 158px;
        height: 158px;
    }
    
    #VIEW-reset .qrcode-block .qrcode .layui-icon {
        line-height: 158px;
        font-size: 44px;
        color: #e6e6e6;
    }
    
    #VIEW-reset .qrcode-block .p1 {
        font-size: 16px;
    }
    
    #VIEW-reset .qrcode-block .p2 {
        font-size: 14px;
        color: #999;
        margin-top: 10px;
        margin-bottom: 20px;
    }
    
    #VIEW-reset .layui-form-item .label-icon {
        position: absolute;
        top: 0;
        left: 0;
        width: 38px;
        line-height: 38px;
        text-align: center;
        color: #d2d2d2!important;
    }
</style>
<div id="VIEW-reset" lay-title="登录">
    <div class="reset-wrap">
        <div class="layui-container">
            <div class="layui-row">
                <div class="layui-col-xs12 layui-col-lg4 layui-col-lg-offset4 nepadmin-tc">
                    <div class="layui-logo"><span>Ne<b>pA</b>dmin</span></div>
                </div>
                <div class="layui-col-xs12 layui-col-lg4 layui-col-lg-offset4">
                    <div class="layui-form" lay-filter="reset-form">
                        <ul class="reset-type-tab">
                            <li reset-type="password" class="active">设置新密码</li>
                        </ul>

                        <div class="normal-reset-form">
                            <div class="layui-form-item">
                                <label class="layui-icon label-icon layui-icon-username"></label>
                                <input type="password" name="pass" value="" lay-verify="required|password" lay-verType="tips" placeholder="新密码" maxlength="20" autocomplete="off" class="layui-input">
                            </div>
                            <div class="layui-form-item password-block">
                                <label class="layui-icon label-icon layui-icon-password"></label>
                                <input type="password" id="pass_re" value="" lay-verify="required" lay-verType="tips" placeholder="再次输入新密码" maxlength="20" autocomplete="off" class="layui-input">
                            </div>
                            <div class="layui-form-item">
                                <button class="layui-btn layui-btn-normal layui-btn-fluid" lay-submit lay-filter="reset-submit">
                                        <i style="display: none" class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop"></i>
                                        立即生效
                                    </button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    layui.use(['admin', 'helper', 'util', 'qrcode', 'form'], function(admin, helper, util, qrcode, form) {
        var $ = layui.jquery;
        var view = $('#VIEW-reset');

        form.render();

        var url = layui.router().href;

        url = url.split("user=");

        if (url.length == 2) {
            url_data = url[1].split("?");
            if (url_data.length != 2 || url_data[0] == '' || url_data[1] == '') {
                admin.navigate('/');
            }
        } else {
            admin.navigate('/');
        }

        form.verify({
            password: function(value, el) {
                var pass_re = $('#pass_re').val();
                if (value.length < 6) {
                    return '登录密码不能少于 6 位'
                }
                if (value != pass_re) {
                    return '两次输入的密码不一致';
                }
            },
        })

        //提交登录表单
        form.on('submit(reset-submit)', function(data) {
            data.field.user = url_data[0];
            data.field.token = url_data[1];
            admin.post({
                api: 'passwords',
                data: data.field,
                success: function(res) {
                    if (res.code == 200) {
                        layer.msg('新密码已生效,3秒后将跳转回登录页面');
                    } else {
                        layer.msg('本重置链接已失效,3秒后将跳转回登录页面');
                    }
                    setTimeout(admin.logout, 3000);
                },
                complete: function() {
                    //loading.hide();
                }
            });
            return false;
        })

    })
</script>